/*
 * @Author: funlee
 * @Email: i@funlee.cn
 * @Date: 2019-07-02 16:31:46
 * @Description: 公用搜索页面样式
 * 涵盖以下页面：
 * 1. 首页-应用工具-企业信息检索-搜索主页
 * 2. 首页-应用工具-APP评论信息检索-搜索主页
 * 3. 挖掘查询-搜索主页
 *
 */
@import "@/assets/style/global.scss";

.common-search {
    width: 100%;
    height: calc(100vh - 70px);
    background: url(../images/bg.png) no-repeat center;
    background-size: 102% auto;
    position: relative;
    $innerWidth: 60%;

    .inner {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;

        .title {
            text-align: center;
            font-size: 30px;
            color: $grayLight;
        }

        .splice {
            text-align: center;
            margin-top: 30px;
        }

        .search-wrap {
            $height: 70px;
            $radius: 4px;
            width: $innerWidth;
            display: flex;
            margin: 80px auto 0;

            input {
                flex: 1;
                font-size: 18px;
                color: $gray;
                height: $height;
                line-height: $height;
                text-indent: 20px;
                background: #f6faff;
                border: none;
                outline: none;
                border-top-left-radius: $radius;
                border-bottom-left-radius: $radius;
            }

            .btn {
                width: 130px;
                text-align: center;
                background: $blueLight;
                color: $grayLight;
                font-size: 18px;
                height: $height;
                line-height: $height;
                border: none;
                outline: none;
                cursor: pointer;
                border-top-right-radius: $radius;
                border-bottom-right-radius: $radius;
            }
        }

        .amount-lists {
            width: $innerWidth;
            margin: 180px auto 0;
            display: flex;
            justify-content: space-between;

            .item {
                padding-left: 60px;
                height: 42px;

                &.all-item {
                    background: url(../images/about-all.png) no-repeat left center;
                    background-size: auto 100%;
                }

                &.company-item {
                    background: url(../images/about-company.png) no-repeat left center;
                    background-size: auto 100%;
                }

                &.person-item {
                    background: url(../images/about-person.png) no-repeat left center;
                    background-size: auto 100%;
                }

                p {
                    line-height: 24px;
                }

                .yellow-text {
                    color: $yellow;
                    padding-right: 6px;
                }
            }
        }
    }

    .EQuery-bottom {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 10%;
        background: url(../images/eye.png) no-repeat left center;
        background-size: auto 100%;
        height: 17px;
        line-height: 17px;
        padding-left: 36px;
    }
    .retrieval-result {
        position: absolute;
        bottom: 28%;
        width: 100%;
        text-align: center;
        &-default{
            color: $gray;
            margin-right: 10px;
            background: url(../images/retrieval-result.png) no-repeat left center;
            padding-left: 28px;
        }
        &-text{
            color: $yellow;
            font-weight: bold;
        }
    }
}
